.wrap .headBox {
  display: flex;
  margin: 0.19rem 0.24rem 0 0.24rem;
  justify-content: space-between;
  align-items: center;
}
.wrap .headBox .back_icon {
  width: 0.44rem;
  height: 0.44rem;
}
.wrap .headBox .level_title {
  font-size: 0.32rem;
  font-weight: 500;
  color: #1E2023;
}
.wrap .headBox .share_icon {
  width: 0.44rem;
  height: 0.44rem;
}
.wrap .contentBox {
  margin: 0.62rem 0.3rem 0 0.3rem;
}
.wrap .contentBox .head {
  display: flex;
  align-items: center;
}
.wrap .contentBox .head .head_img {
  width: 0.6rem;
  height: 0.6rem;
}
.wrap .contentBox .head .name {
  font-size: 0.28rem;
  font-weight: 500;
  color: #1E2023;
  margin-left: 0.12rem;
}
.wrap .contentBox .head .level_img {
  width: 1.22rem;
  height: 0.48rem;
  margin-left: 0.08rem;
}
.wrap .contentBox .content {
  width: 6.44rem;
  height: 4.4rem;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  display: flex;
  flex-direction: column;
}
.wrap .contentBox .content .titleBox {
  margin: 0.22rem 0 0 0.14rem;
  width: 1.32rem;
  height: 0.4rem;
  background: rgba(236, 132, 39, 0.6);
  opacity: 0.8;
  border-radius: 0.2rem 0 0.2rem 0;
  display: flex;
  align-items: center;
  justify-content: space-around;
}
.wrap .contentBox .content .titleBox h3 {
  font-size: 0.2rem;
  font-weight: 400;
  color: #FFFFFF;
}
.wrap .contentBox .content .level_xinxi {
  display: flex;
  flex-direction: column;
  margin: 0.73rem 0 0 0.44rem;
}
.wrap .contentBox .content .level_xinxi .level_name {
  font-size: 0.3rem;
  color: #FFFFFF;
}
.wrap .contentBox .content .level_xinxi .jifen,
.wrap .contentBox .content .level_xinxi .day,
.wrap .contentBox .content .level_xinxi .beyond {
  font-size: 0.2rem;
  color: #FFFFFF;
  margin-top: 0.11rem;
}
.wrap .contentBox .content .level_xinxi .jifen {
  margin-top: 0.19rem;
}
.wrap .contentBox .content .gradeBox {
  margin: 0.63rem 0 0 0.48rem;
  display: flex;
  flex-direction: column;
  width: 5.54rem;
}
.wrap .contentBox .content .gradeBox .grade {
  width: 5.52rem;
  height: 0.04rem;
  background: #f7e6cc;
  display: flex;
  position: relative;
  justify-content: space-between;
  align-items: center;
}
.wrap .contentBox .content .gradeBox .grade .jindu {
  position: absolute;
  width: 50%;
  height: 0.04rem;
  background: #FFFFFF;
  z-index: 100;
}
.wrap .contentBox .content .gradeBox .grade .circle {
  width: 0.14rem;
  height: 0.14rem;
  border: 0.04rem solid #FFFFFF;
  border-radius: 50%;
  z-index: 10;
}
.wrap .contentBox .content .gradeBox .grade .circle_active {
  width: 0.18rem;
  height: 0.18rem;
  background-color: #FFFFFF;
  border-radius: 50%;
  border: none;
}
.wrap .contentBox .content .gradeBox .level {
  display: flex;
  justify-content: space-between;
  margin-top: 0.05rem;
}
.wrap .contentBox .content .gradeBox .level span {
  font-size: 0.18rem;
  color: #FFFFFF;
  opacity: 1;
}
.wrap .contentBox .quanyiBox .head,
.wrap .contentBox .howBox .head,
.wrap .contentBox .whyBox .head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.wrap .contentBox .quanyiBox .head .left,
.wrap .contentBox .howBox .head .left,
.wrap .contentBox .whyBox .head .left {
  display: flex;
  align-items: center;
}
.wrap .contentBox .quanyiBox .head .left .line,
.wrap .contentBox .howBox .head .left .line,
.wrap .contentBox .whyBox .head .left .line {
  width: 0.08rem;
  height: 0.4rem;
  background: #60A7F6;
  opacity: 1;
  border-radius: 0.04rem;
}
.wrap .contentBox .quanyiBox .head .left .title_text,
.wrap .contentBox .howBox .head .left .title_text,
.wrap .contentBox .whyBox .head .left .title_text {
  font-size: 0.36rem;
  font-weight: 500;
  color: #1E2023;
  margin-left: 0.08rem;
}
.wrap .contentBox .quanyiBox {
  margin-top: 0.32rem;
}
.wrap .contentBox .quanyiBox .quanyiUl {
  display: flex;
  flex-wrap: wrap;
  margin: 0.32rem 0.88rem 0 0.58rem;
  justify-content: space-between;
}
.wrap .contentBox .quanyiBox .quanyiUl .quanyiLi:first-child {
  margin-left: 0;
}
.wrap .contentBox .quanyiBox .quanyiUl .quanyiLi:nth-child(5) {
  margin-left: 0;
}
.wrap .contentBox .quanyiBox .quanyiUl .quanyiLi {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-left: 0.52rem;
  margin-bottom: 0.16rem;
}
.wrap .contentBox .quanyiBox .quanyiUl .quanyiLi img {
  width: 0.56rem;
  height: 0.56rem;
}
.wrap .contentBox .quanyiBox .quanyiUl .quanyiLi p {
  font-size: 0.2rem;
  color: #1E2023;
}
.wrap .contentBox .howBox {
  margin-top: 0.34rem;
}
.wrap .contentBox .howBox .textBox {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 0.18rem;
}
.wrap .contentBox .howBox .textBox p {
  font-size: 0.2rem;
  color: #8A93A1;
  opacity: 1;
}
.wrap .contentBox .howBox .textBox button {
  font-size: 0.18rem;
  color: #FFFFFF;
  width: 1.62rem;
  height: 0.36rem;
  background: #60A7F6;
  opacity: 1;
  border-radius: 18px;
  border: none;
  margin-top: 0.4rem;
}
.wrap .contentBox .whyBox {
  margin-top: 0.37rem;
}
.wrap .contentBox .whyBox .textBox {
  margin-top: 0.18rem;
}
.wrap .contentBox .whyBox .textBox p {
  font-size: 0.2rem;
  color: #8A93A1;
  opacity: 1;
}
